<script src="<?php echo ROOT_URL; ?>public/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="<?php echo ROOT_URL; ?>public/js/jquery.ui.touch-punch.min.js"></script>

<link href="<?php echo ROOT_URL; ?>public/css/management.css" rel="stylesheet">
<link href="<?php echo ROOT_URL; ?>public/load/cog.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="<?php echo ROOT_URL; ?>public/load/html5.js"></script>
<![endif]-->

<div id="container">
    <div class="content" style="min-height: 500px">
        <div class="sidebar">
            <div class="sidebar-shortcuts" id="sidebar-shortcuts">
                <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
                    <button class="btn facebook-icon btn-small btn-success">
                        <i class="fa fa-facebook"></i>
                    </button>

                    <button class="btn google-icon btn-small btn-info">
                        <i class="fa fa-google"></i>
                    </button>

                    <button class="btn twitter-icon btn-small btn-warning">
                        <i class="fa fa-twitter"></i>
                    </button>

                    <button class="btn youtube-icon btn-small btn-danger">
                        <i class="fa fa-youtube-play"></i>
                    </button>
                </div>

                <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
                    <span class="btn btn-success"></span>

                    <span class="btn btn-info"></span>

                    <span class="btn btn-warning"></span>

                    <span class="btn btn-danger"></span>
                </div>
            </div>
            <ul class="nav nav-list">
                <li class="nav-item open">
                    <a class="dropdown-toggle"><i class="fa fa-bullhorn"></i>Campaign <i class="arrow fa fa-angle-down"></i></a>

                    <ul class="sub-menu">
                        <li><a href="<?php echo ROOT_URL; ?>management#ccreate"><i class="fa fa-angle-double-right"></i>Create New Campaign</a></li>
                        <li><a href="<?php echo ROOT_URL; ?>management#campaign"><i class="fa fa-angle-double-right"></i>Campaign</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="dropdown-toggle"><i class="fa fa-list-alt"></i> Survey <i class="arrow fa fa-angle-down"></i></a>
                    <ul class="sub-menu" style="display: none">
                        <li><a href="<?php echo ROOT_URL; ?>management#screate"><i class="fa fa-angle-double-right"></i>Create New Survey</a></li>
                        <li><a href="<?php echo ROOT_URL; ?>management#survey"><i class="fa fa-angle-double-right"></i>Survey</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="dropdown-toggle"><i class="fa fa-tags"></i> Attributes <i class="arrow fa fa-angle-down"></i></a>
                    <ul class="sub-menu" style="display: none">
                        <li><a href="<?php echo ROOT_URL; ?>management#attributes"><i class="fa fa-angle-double-right"></i>Attributes</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="dropdown-toggle"><i class="fa fa-users"></i>Permission <i class="arrow fa fa-angle-down"></i></a>
                    <ul class="sub-menu" style="display: none">
                        <li><a href="<?php echo ROOT_URL; ?>management#groups"><i class="fa fa-angle-double-right"></i>Groups</a></li>
                    </ul>
                </li>
            </ul>
            <div class="sidebar-collapse" id="sidebar-collapse">
                <span class="icon-double-angle-left">
                    <i class="fa fa-angle-double-left"></i>
                </span>
            </div>
        </div>
        <div class="main-content">
            <div class="main-content-header">
                <i class="home-icon fa fa-home"></i> Home
            </div>
            <div id="management-body" class="main-content-body">
                <div id="loader" class="overlay-loader">
                    <img class="loader-icon spinning-cog" src="<?php echo ROOT_URL; ?>public/load/cogs/cog16.svg" data-cog="cog16">
                </div>
                <div class="main-tab">

                </div>
            </div>
        </div>
    </div>
</div>

<div id="progress" style="display: none" >
    <div class="progress-loader overlay-loader">
        <img class="loader-icon spinning-cog" src="<?php echo ROOT_URL; ?>public/load/cogs/cog16.svg" data-cog="cog16">
    </div>
    <div class="progress-content">
        Saving...
    </div>
</div>

<script src="<?php echo ROOT_URL; ?>public/js/management.js"></script>
<script>
    $(function(){
        window.onhashchange = hashchanged;
    });

    //Change menu
    hashchanged();
    var loader = $('#loader');
    $(window).load(function(){
        loader.find('.loader-icon').removeClass('spinning-cog').addClass('shrinking-cog');
    });
</script>
